<script lang="ts">
export default {
  name: "XHome",
};
</script>
<script setup lang="ts">
import HeaderBar from "@/layout/HeaderBar/index.vue";
import SideBar from "@/layout/SideBar/index.vue";
</script>

<template>
  <HeaderBar />
  <div class="content">
    <SideBar />
    <div class="right">
      <router-view v-slot="{ Component }">
        <keep-alive>
          <component :is="Component" />
        </keep-alive>
      </router-view>
    </div>
  </div>
</template>

<style lang="less" scoped>
.content {
  display: flex;

  .right {
    height: calc(100vh - 80px);
    flex-grow: 1;
    overflow-x: hidden;
    overflow-y: scroll;
  }
}
</style>
